ci: use nx for task orchestration for build/test/lint/type-check #26928

Hotell · 2023-02-21T15:07:49Z

Pre-requirements:

Required:

migrate to jest 27 chore: migrate to jest 27 #26835

Optional:

migrate to jest 28 - to have smaller node_modules and only 1 version of jest | chore: migrate monorepo to jest 28 #26958
Typescript 4.7 ( to have 100% guarantee nx source parser uses same TS version that it needs )

Previous Behavior

New Behavior

Related Issue(s)

Fixes #

size-auditor · 2023-02-21T15:21:45Z

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 3c54de58895744516ed7befb629d77bac039a9e2 (build)

codesandbox-ci · 2023-02-21T15:24:04Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 1f0b7cc:

Sandbox	Source
@fluentui/react 8 starter	Configuration
@fluentui/react-components 9 starter	Configuration

fabricteam · 2023-02-21T15:27:03Z

Perf Analysis (`@fluentui/react-components`)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations
Avatar	mount	905	896	5000
Button	mount	583	583	5000
Field	mount	1546	1557	5000
FluentProvider	mount	1104	1091	5000
FluentProviderWithTheme	mount	286	298	10
FluentProviderWithTheme	virtual-rerender	275	274	10
FluentProviderWithTheme	virtual-rerender-with-unmount	298	286	10
InfoButton	mount	201	207	5000
MakeStyles	mount	1375	1376	50000
Persona	mount	2089	2064	5000
SpinButton	mount	1824	1804	5000

fabricteam · 2023-02-21T15:30:43Z

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
`react-dialog` Dialog (including children components)	`93.616 kB` `27.452 kB`	`93.614 kB` `27.449 kB`	`-2 B` `-3 B`

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
`global-context` createContext	`533 B` `341 B`
`global-context` createContextSelector	`560 B` `352 B`
`priority-overflow` createOverflowManager	`3.194 kB` `1.314 kB`
`react-accordion` Accordion (including children components)	`88.882 kB` `26.551 kB`
`react-alert` Alert	`96.647 kB` `23.133 kB`
`react-avatar` Avatar	`60.312 kB` `15.579 kB`
`react-avatar` AvatarGroup	`18.178 kB` `6.683 kB`
`react-avatar` AvatarGroupItem	`76.573 kB` `20.086 kB`
`react-badge` Badge	`25.85 kB` `7.585 kB`
`react-badge` CounterBadge	`26.833 kB` `7.889 kB`
`react-badge` PresenceBadge	`34.458 kB` `8.693 kB`
`react-button` Button	`39.749 kB` `9.959 kB`
`react-button` CompoundButton	`46.921 kB` `11.428 kB`
`react-button` MenuButton	`44.437 kB` `11.306 kB`
`react-button` SplitButton	`52.931 kB` `12.872 kB`
`react-button` ToggleButton	`58.121 kB` `11.878 kB`
`react-card` Card - All	`83.489 kB` `23.894 kB`
`react-card` Card	`78.308 kB` `22.431 kB`
`react-card` CardFooter	`9.035 kB` `3.799 kB`
`react-card` CardHeader	`10.959 kB` `4.503 kB`
`react-card` CardPreview	`9.84 kB` `4.153 kB`
`react-checkbox` Checkbox	`36.067 kB` `10.856 kB`
`react-checkbox` CheckboxField	`43.019 kB` `12.787 kB`
`react-combobox` Combobox (including child components)	`88.73 kB` `28.105 kB`
`react-combobox` ComboboxField	`85.147 kB` `27.871 kB`
`react-combobox` Dropdown (including child components)	`87.428 kB` `27.853 kB`
`react-components` react-components: Button, FluentProvider & webLightTheme	`67.994 kB` `18.395 kB`
`react-components` react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	`207.4 kB` `57.516 kB`
`react-components` react-components: FluentProvider & webLightTheme	`38.819 kB` `12.351 kB`
`react-divider` Divider	`19.863 kB` `6.697 kB`
`react-field` Field	`20.552 kB` `7.092 kB`
`react-image` Image	`14.011 kB` `4.993 kB`
`react-infobutton` InfoButton	`130.577 kB` `39.439 kB`
`react-infobutton` InfoLabel	`133.874 kB` `40.488 kB`
`react-input` Input	`25.747 kB` `7.697 kB`
`react-input` InputField	`35.723 kB` `10.637 kB`
`react-label` Label	`12.57 kB` `4.586 kB`
`react-link` Link	`12.301 kB` `5.07 kB`
`react-menu` Menu (including children components)	`130.926 kB` `39.629 kB`
`react-menu` Menu (including selectable components)	`134.062 kB` `40.161 kB`
`react-overflow` hooks only	`11.214 kB` `4.271 kB`
`react-persona` Persona	`67.338 kB` `17.524 kB`
`react-popover` Popover	`117.58 kB` `35.828 kB`
`react-portal` Portal	`11.649 kB` `4.263 kB`
`react-portal-compat` PortalCompatProvider	`6.446 kB` `2.185 kB`
`react-positioning` usePositioning	`24.008 kB` `8.798 kB`
`react-progress` ProgressBar	`15.961 kB` `5.675 kB`
`react-progress` ProgressField	`26.435 kB` `8.859 kB`
`react-provider` FluentProvider	`20.766 kB` `7.119 kB`
`react-radio` Radio	`35.48 kB` `11.126 kB`
`react-radio` RadioGroup	`17.988 kB` `6.544 kB`
`react-radio` RadioGroupField	`28.166 kB` `9.735 kB`
`react-select` Select	`26.957 kB` `8.766 kB`
`react-select` SelectField	`36.293 kB` `11.316 kB`
`react-slider` Slider	`35.919 kB` `11.059 kB`
`react-slider` SliderField	`45.847 kB` `14.005 kB`
`react-spinbutton` SpinButton	`35.648 kB` `10.348 kB`
`react-spinbutton` SpinButtonField	`44.671 kB` `12.812 kB`
`react-spinner` Spinner	`23.425 kB` `7.195 kB`
`react-switch` Switch	`31.413 kB` `9.294 kB`
`react-switch` SwitchField	`38.317 kB` `11.21 kB`
`react-table` DataGrid	`149.878 kB` `40.662 kB`
`react-table` Table (Primitives only)	`47.119 kB` `12.703 kB`
`react-table` Table as DataGrid	`138.018 kB` `35.282 kB`
`react-table` Table (Selection only)	`85.849 kB` `21.303 kB`
`react-table` Table (Sort only)	`85.179 kB` `21.113 kB`
`react-text` Text - Default	`15.018 kB` `5.327 kB`
`react-text` Text - Wrappers	`15.572 kB` `5.23 kB`
`react-textarea` Textarea	`29.07 kB` `9.081 kB`
`react-textarea` TextareaField	`39.454 kB` `12.055 kB`
`react-theme` Single theme token import	`69 B` `89 B`
`react-theme` Teams: all themes	`31.33 kB` `6.764 kB`
`react-theme` Teams: Light theme	`17.895 kB` `5.162 kB`
`react-tooltip` Tooltip	`49.388 kB` `16.815 kB`
`react-utilities` SSRProvider	`180 B` `159 B`

_{🤖 This report was generated against 3c54de58895744516ed7befb629d77bac039a9e2}

fabricteam · 2023-02-21T15:30:52Z

Perf Analysis (`@fluentui/react-northstar`)

⚠️ No perf measurements available

fabricteam · 2023-02-21T15:40:36Z

🕵 FluentUI-v0 No visual regressions between this PR and main

fabricteam · 2023-02-21T15:54:50Z

Perf Analysis (`@fluentui/react`)

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
GroupedList	mount	47078	60285	2	Possible regression

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
BaseButton	mount	984	1003	5000
Breadcrumb	mount	2384	2341	1000
Checkbox	mount	2245	2242	5000
CheckboxBase	mount	2015	2007	5000
ChoiceGroup	mount	3902	3903	5000
ComboBox	mount	1063	1045	1000
CommandBar	mount	8495	8358	1000
ContextualMenu	mount	18974	18303	1000
DefaultButton	mount	1172	1157	5000
DetailsRow	mount	3104	3108	5000
DetailsRowFast	mount	3084	3075	5000
DetailsRowNoStyles	mount	2819	2820	5000
Dialog	mount	3397	3426	1000
DocumentCardTitle	mount	460	450	1000
Dropdown	mount	2786	2754	5000
FocusTrapZone	mount	1646	1663	5000
FocusZone	mount	1601	1621	5000
GroupedList	mount	47078	60285	2	Possible regression
GroupedList	virtual-rerender	22668	25099	2
GroupedList	virtual-rerender-with-unmount	78547	77441	2
GroupedListV2	mount	455	446	2
GroupedListV2	virtual-rerender	439	446	2
GroupedListV2	virtual-rerender-with-unmount	442	450	2
IconButton	mount	1611	1606	5000
Label	mount	585	585	5000
Layer	mount	3661	3724	5000
Link	mount	679	649	5000
MenuButton	mount	1403	1401	5000
MessageBar	mount	28506	28445	5000
Nav	mount	2715	2707	1000
OverflowSet	mount	1130	1159	5000
Panel	mount	2174	2152	1000
Persona	mount	1123	1103	1000
Pivot	mount	1343	1370	1000
PrimaryButton	mount	1261	1262	5000
Rating	mount	5855	5931	5000
SearchBox	mount	1286	1280	5000
Shimmer	mount	2479	2478	5000
Slider	mount	1828	1826	5000
SpinButton	mount	3960	3949	5000
Spinner	mount	658	644	5000
SplitButton	mount	2694	2695	5000
Stack	mount	674	663	5000
StackWithIntrinsicChildren	mount	1267	1306	5000
StackWithTextChildren	mount	3389	3432	5000
SwatchColorPicker	mount	8335	8353	5000
TagPicker	mount	2184	2181	5000
Text	mount	646	641	5000
TextField	mount	1323	1336	5000
ThemeProvider	mount	1228	1249	5000
ThemeProvider	virtual-rerender	886	893	5000
ThemeProvider	virtual-rerender-with-unmount	1831	1842	5000
Toggle	mount	906	918	5000
buttonNative	mount	413	405	5000

Hotell · 2023-03-03T15:18:53Z

package.json

    "@swc/helpers": "0.4.14",
+    "@swc-node/register": "1.6.1",


we cannot bump to 1.6.2 as it will nuke in memory transpilation as it uses under the hood magic that makes it impossible to provide path of which tsconfig should be processed. with that nx register nor direct swc-node/register won't work. 🫡

https://github.com/swc-project/swc-node/pull/694/files#diff-ee889b20e67f97e369cf078afdaa61291584181ad69c5f4be1da106b017923d8R102

fabricteam · 2023-03-03T15:40:32Z

🕵 fluentuiv9 No visual regressions between this PR and main

Hotell · 2023-03-17T08:32:52Z

/azp run

…configName and configDir

…ormance execution

…o json

…m v8,v0

…tprint on CI

…cking performance

…when executing tsc to improve perf

…r tsc to improve execution speed

…n unnecessary processing for run-many --target=build

…uild DX

…lid registerTsPaths api

…issues

msft-fluent-ui-bot assigned Hotell Feb 21, 2023

github-actions bot added this to the February Project Cycle Q1 2023 milestone Feb 21, 2023

Hotell removed their assignment Feb 22, 2023

Hotell force-pushed the hotell/build/ci/use-nx branch from 08954ed to 085f25b Compare March 1, 2023 10:43

Hotell mentioned this pull request Mar 1, 2023

[Bug]: yarn is not following yarn.lock for hoisting - webpack duplicates #27017

Closed

2 tasks

github-actions bot modified the milestones: February Project Cycle Q1 2023, March Project Cycle Q1 2023 Mar 1, 2023

Hotell force-pushed the hotell/build/ci/use-nx branch 6 times, most recently from 4034a5a to 9f591aa Compare March 3, 2023 15:16

Hotell commented Mar 3, 2023

View reviewed changes

Hotell force-pushed the hotell/build/ci/use-nx branch 5 times, most recently from a6219fc to 9578c50 Compare March 8, 2023 17:36

Hotell force-pushed the hotell/build/ci/use-nx branch 2 times, most recently from 8a2288c to 2427f20 Compare March 16, 2023 15:38

Hotell added 28 commits March 28, 2023 18:30

chore: migrate to nx 15.8.5

3d5a2ee

ci: add new job PR to get more data

aa9b990

feat(react-conformance): add new TS config api to be able to specify …

af847c1

…configName and configDir

chore(react-conformance): hardcode resolving proper tsconfig for conf…

8d9e976

…ormance execution

chore(react-components): use swc/jest for tests

8daa600

chore(react): remove unused common/ code and simplify eslint config t…

74f3b8f

…o json

ci: try fixing yarn install

e11b84c

ci: narrow down pipelines to get nx vs lage comparison

ac3e3de

test: improve jest execution speeds by removing -i and --coverage fro…

d5e14af

…m v8,v0

test: try using maxworkers for v9 to improve jest execution speeds on CI

22465fb

test: use isolatedModules for all ts-jest configs to lower memory foo…

5b5d854

…tprint on CI

feat: integrate lerna with nx

ac47f2a

chore(lage): remove redundant task dependency config

202a3a7

feat(scripts/tasks): implement type-check command to improve type che…

3ee08f6

…cking performance

chore: use ts-solution config for v8 and emit only declaration in v0 …

fa998f0

…when executing tsc to improve perf

chore(scripts-tasks): disable path aliases when running build task fo…

fd37bce

…r tsc to improve execution speed

chore(scripts-tasks): improve copy-comiled task execution by 99%

341df5e

chore(vr-tests): remove 'build' task for vr-tests to unify and not ru…

e180086

…n unnecessary processing for run-many --target=build

ci: add logs to determine what's wrong with yarn install

0a1e2dd

chore(fluentui/e2e): speedup ts processing and make it work with no-b…

6dbc149

…uild DX

ci: add new pipeline for only e2e without all deps build needed

e784acb

chore(react-18-tests-v8): make e2e work withou no-build DX

2a847fc

ci: create gha for PR

9624833

fix(scripts-storybook): update loadWorkspaceAddon template to call va…

1455d09

…lid registerTsPaths api

test(fluentui/react): fix initial global leaks that were causing OOM …

d2ccd21

…issues

chore: migrate to nx 15.8.7

4e11c94

ci(ado): add nx affected pipeline for testing

f49121b

docs: push perf docs

1f0b7cc

Hotell force-pushed the hotell/build/ci/use-nx branch from dc00988 to 1f0b7cc Compare March 28, 2023 16:31

Hotell mentioned this pull request Mar 28, 2023

Epic: road to faster CI/CD #27359

Open

9 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

ci: use nx for task orchestration for build/test/lint/type-check #26928

ci: use nx for task orchestration for build/test/lint/type-check #26928

Hotell commented Feb 21, 2023 •

edited

Loading

size-auditor bot commented Feb 21, 2023 •

edited

Loading

codesandbox-ci bot commented Feb 21, 2023 •

edited

Loading

fabricteam commented Feb 21, 2023 •

edited

Loading

fabricteam commented Feb 21, 2023 •

edited

Loading

fabricteam commented Feb 21, 2023

fabricteam commented Feb 21, 2023 •

edited

Loading

fabricteam commented Feb 21, 2023 •

edited

Loading

Hotell Mar 3, 2023

fabricteam commented Mar 3, 2023 •

edited

Loading

Hotell commented Mar 17, 2023

ci: use nx for task orchestration for build/test/lint/type-check #26928

Are you sure you want to change the base?

ci: use nx for task orchestration for build/test/lint/type-check #26928

Conversation

Hotell commented Feb 21, 2023 • edited Loading

Previous Behavior

New Behavior

Related Issue(s)

size-auditor bot commented Feb 21, 2023 • edited Loading

Asset size changes

codesandbox-ci bot commented Feb 21, 2023 • edited Loading

fabricteam commented Feb 21, 2023 • edited Loading

Perf Analysis (@fluentui/react-components)

fabricteam commented Feb 21, 2023 • edited Loading

📊 Bundle size report

fabricteam commented Feb 21, 2023

Perf Analysis (@fluentui/react-northstar)

fabricteam commented Feb 21, 2023 • edited Loading

🕵 FluentUI-v0 No visual regressions between this PR and main

fabricteam commented Feb 21, 2023 • edited Loading

Perf Analysis (@fluentui/react)

Hotell Mar 3, 2023

Choose a reason for hiding this comment

fabricteam commented Mar 3, 2023 • edited Loading

🕵 fluentuiv9 No visual regressions between this PR and main

Hotell commented Mar 17, 2023

Hotell commented Feb 21, 2023 •

edited

Loading

size-auditor bot commented Feb 21, 2023 •

edited

Loading

codesandbox-ci bot commented Feb 21, 2023 •

edited

Loading

fabricteam commented Feb 21, 2023 •

edited

Loading

Perf Analysis (`@fluentui/react-components`)

fabricteam commented Feb 21, 2023 •

edited

Loading

Perf Analysis (`@fluentui/react-northstar`)

fabricteam commented Feb 21, 2023 •

edited

Loading

fabricteam commented Feb 21, 2023 •

edited

Loading

Perf Analysis (`@fluentui/react`)

fabricteam commented Mar 3, 2023 •

edited

Loading